<template>
  <div>
    <el-row class="">
      <el-col :span="22">签字记录</el-col>
    </el-row>
    <el-divider content-position="center"></el-divider>
    <el-row>
      <data-table
        :value="tableData"
        :total-count="totalCount"
        :table-column-attributes="tableColumnAttributes"
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
      >
      </data-table>
    </el-row>
  </div>
</template>

<script>
import { signaturePage } from '@/api/after-sale/workOrderManage/signature'
import { orderTypeData } from '@/views/after-sale/workOrderManage/view/config/index'
import baseMixin from '@/mixins/base'

export default {
  name: 'carInfo',
  components: {},
  props: ['workOrderId', 'workOrderType'], // workOrderType 工单类型 1快速单
  mixins: [
    baseMixin({
      // findData: signaturePage,
      dataName: ['content', 'totalRecords'],
      idName: 'id',
    }),
  ],
  data () {
    return {
      searchOptions: {
        workOrderId: this.workOrderId,
        orderType: '',
      },
      tableColumnAttributes: [
        { name: '签字人', value: 'clientName', type: 'text' },
        { name: '签字时间', value: 'createTime', type: 'text' },
        { name: '签字图片', value: 'photos', type: 'img' },
        { name: '签字环节', value: 'desc', type: 'text' },
      ],
    }
  },
  async created () {
    this.notQuery = false;
    orderTypeData.map(item => {
      if (item.key == this.workOrderType) {
        this.searchOptions.orderType = item.value
      }
    })
  },
  methods: {
    async setTableData () {
      if (!this.notQuery) {
        let fun = signaturePage;
        if (fun) {
          let res = await fun(this.searchOptions, this.pageSize, this.currentPage);
          this.totalCount = parseInt(res.data['totalRecords'])
          this.tableData = res.data['content'];
        }
      }
    },
    changeType (item) {
      this.selectedTypeText = item.label
    },
  },
  mounted () { },
}
</script>

<style lang="scss" scoped>
.el-table .delete-row {
  background: #f5f7fa;
  color: #ccc !important;
}
.avatar-uploader .el-upload {
  border: 1px dashed #d9d9d9;
  border-radius: 6px;
  cursor: pointer;
  position: relative;
  overflow: hidden;
}
.avatar-uploader .el-upload:hover {
  border-color: #409eff;
}
.avatar-uploader-icon {
  font-size: 28px;
  color: #8c939d;
  width: 178px;
  height: 178px;
  line-height: 178px;
  text-align: center;
}
.avatar {
  width: 80px;
  height: 80px;
  display: block;
}
</style>
